aristath /
kirki
| Conditions | 33 |
| Paths | 24 |
| Total Lines | 135 |
| Lines | 0 |
| Ratio | 0 % |
| Changes | 0 | ||
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
Complex classes like kirkiSetSettingValue.set often do a lot of different things. To break such a class down, we need to identify a cohesive component within that class. A common approach to find such a component is to look for fields/methods that share the same prefixes, or suffixes.
Once you have determined the fields that belong together, you can apply the Extract Class refactoring. If the component makes sense as a sub-class, Extract Subclass is also a candidate, and is often faster.
| 1 | /* jshint -W079 */ |
||
| 13 | set: function( setting, value ) { |
||
| 14 | |||
| 15 | /** |
||
| 16 | * Get the control of the sub-setting. |
||
| 17 | * This will be used to get properties we need from that control, |
||
| 18 | * and determine if we need to do any further work based on those. |
||
| 19 | */ |
||
| 20 | var $this = this, |
||
| 21 | subControl = wp.customize.settings.controls[ setting ], |
||
| 22 | valueJSON; |
||
| 23 | |||
| 24 | // If the control doesn't exist then return. |
||
| 25 | if ( _.isUndefined( subControl ) ) { |
||
| 26 | return true; |
||
| 27 | } |
||
| 28 | |||
| 29 | // First set the value in the wp object. The control type doesn't matter here. |
||
| 30 | $this.setValue( setting, value ); |
||
| 31 | |||
| 32 | // Process visually changing the value based on the control type. |
||
| 33 | switch ( subControl.type ) { |
||
| 34 | |||
| 35 | case 'kirki-background': |
||
| 36 | if ( ! _.isUndefined( value['background-color'] ) ) { |
||
| 37 | $this.setColorPicker( $this.findElement( setting, '.kirki-color-control' ), value['background-color'] ); |
||
| 38 | } |
||
| 39 | $this.findElement( setting, '.placeholder, .thumbnail' ).removeClass().addClass( 'placeholder' ).html( 'No file selected' ); |
||
| 40 | _.each( ['background-repeat', 'background-position'], function( subVal ) { |
||
| 41 | if ( ! _.isUndefined( value[ subVal ] ) ) { |
||
| 42 | $this.setSelectWoo( $this.findElement( setting, '.' + subVal + ' select' ), value[ subVal ] ); |
||
| 43 | } |
||
| 44 | }); |
||
| 45 | _.each( ['background-size', 'background-attachment'], function( subVal ) { |
||
| 46 | jQuery( $this.findElement( setting, '.' + subVal + ' input[value="' + value + '"]' ) ).prop( 'checked', true ); |
||
| 47 | }); |
||
| 48 | valueJSON = JSON.stringify( value ).replace( /'/g, ''' ); |
||
| 49 | jQuery( $this.findElement( setting, '.background-hidden-value' ).attr( 'value', valueJSON ) ).trigger( 'change' ); |
||
| 50 | break; |
||
| 51 | |||
| 52 | case 'kirki-code': |
||
| 53 | jQuery( $this.findElement( setting, '.CodeMirror' ) )[0].CodeMirror.setValue( value ); |
||
| 54 | break; |
||
| 55 | |||
| 56 | case 'checkbox': |
||
| 57 | case 'kirki-switch': |
||
| 58 | case 'kirki-toggle': |
||
| 59 | value = ( 1 === value || '1' === value || true === value ) ? true : false; |
||
| 60 | jQuery( $this.findElement( setting, 'input' ) ).prop( 'checked', value ); |
||
| 61 | wp.customize.instance( setting ).set( value ); |
||
| 62 | break; |
||
| 63 | |||
| 64 | case 'kirki-select': |
||
| 65 | case 'kirki-preset': |
||
| 66 | case 'kirki-fontawesome': |
||
| 67 | $this.setSelectWoo( $this.findElement( setting, 'select' ), value ); |
||
| 68 | break; |
||
| 69 | |||
| 70 | case 'kirki-slider': |
||
| 71 | jQuery( $this.findElement( setting, 'input' ) ).prop( 'value', value ); |
||
| 72 | jQuery( $this.findElement( setting, '.kirki_range_value .value' ) ).html( value ); |
||
| 73 | break; |
||
| 74 | |||
| 75 | case 'kirki-generic': |
||
| 76 | if ( _.isUndefined( subControl.choices ) || _.isUndefined( subControl.choices.element ) ) { |
||
| 77 | subControl.choices.element = 'input'; |
||
| 78 | } |
||
| 79 | jQuery( $this.findElement( setting, subControl.choices.element ) ).prop( 'value', value ); |
||
| 80 | break; |
||
| 81 | |||
| 82 | case 'kirki-color': |
||
| 83 | $this.setColorPicker( $this.findElement( setting, '.kirki-color-control' ), value ); |
||
| 84 | break; |
||
| 85 | |||
| 86 | case 'kirki-multicheck': |
||
| 87 | $this.findElement( setting, 'input' ).each( function() { |
||
| 88 | jQuery( this ).prop( 'checked', false ); |
||
| 89 | }); |
||
| 90 | _.each( value, function( subValue, i ) { |
||
| 91 | jQuery( $this.findElement( setting, 'input[value="' + value[ i ] + '"]' ) ).prop( 'checked', true ); |
||
| 92 | }); |
||
| 93 | break; |
||
| 94 | |||
| 95 | case 'kirki-multicolor': |
||
| 96 | _.each( value, function( subVal, index ) { |
||
| 97 | $this.setColorPicker( $this.findElement( setting, '.multicolor-index-' + index ), subVal ); |
||
| 98 | }); |
||
| 99 | break; |
||
| 100 | |||
| 101 | case 'kirki-radio-buttonset': |
||
| 102 | case 'kirki-radio-image': |
||
| 103 | case 'kirki-radio': |
||
| 104 | case 'kirki-dashicons': |
||
| 105 | case 'kirki-color-palette': |
||
| 106 | case 'kirki-palette': |
||
| 107 | jQuery( $this.findElement( setting, 'input[value="' + value + '"]' ) ).prop( 'checked', true ); |
||
| 108 | break; |
||
| 109 | |||
| 110 | case 'kirki-typography': |
||
| 111 | _.each( ['font-family', 'variant', 'subsets'], function( subVal ) { |
||
| 112 | if ( ! _.isUndefined( value[ subVal ] ) ) { |
||
| 113 | $this.setSelectWoo( $this.findElement( setting, '.' + subVal + ' select' ), value[ subVal ] ); |
||
| 114 | } |
||
| 115 | }); |
||
| 116 | _.each( ['font-size', 'line-height', 'letter-spacing', 'word-spacing'], function( subVal ) { |
||
| 117 | if ( ! _.isUndefined( value[ subVal ] ) ) { |
||
| 118 | jQuery( $this.findElement( setting, '.' + subVal + ' input' ) ).prop( 'value', value[ subVal ] ); |
||
| 119 | } |
||
| 120 | }); |
||
| 121 | |||
| 122 | if ( ! _.isUndefined( value.color ) ) { |
||
| 123 | $this.setColorPicker( $this.findElement( setting, '.kirki-color-control' ), value.color ); |
||
| 124 | } |
||
| 125 | valueJSON = JSON.stringify( value ).replace( /'/g, ''' ); |
||
| 126 | jQuery( $this.findElement( setting, '.typography-hidden-value' ).attr( 'value', valueJSON ) ).trigger( 'change' ); |
||
| 127 | break; |
||
| 128 | |||
| 129 | case 'kirki-dimensions': |
||
| 130 | _.each( value, function( subValue, id ) { |
||
| 131 | jQuery( $this.findElement( setting, '.' + id + ' input' ) ).prop( 'value', subValue ); |
||
| 132 | }); |
||
| 133 | break; |
||
| 134 | |||
| 135 | case 'kirki-repeater': |
||
| 136 | |||
| 137 | // Not yet implemented. |
||
| 138 | break; |
||
| 139 | |||
| 140 | case 'kirki-custom': |
||
| 141 | |||
| 142 | // Do nothing. |
||
| 143 | break; |
||
| 144 | default: |
||
| 145 | jQuery( $this.findElement( setting, 'input' ) ).prop( 'value', value ); |
||
| 146 | } |
||
| 147 | }, |
||
| 148 | |||
| 212 |
